<style>
    img.fans-portrait{
        width:50px;
        height:50px;
    }
    .fsh-rightPanel .layui-table-body .layui-table-cell {
        height: 50px;
        line-height: 50px;
    }
</style>
<div class="fsh-rightPanel">
    <div class="layui-anim layui-anim-upbit">
        <div class="layui-form-item wx-search" id="list_form">
        	<!-- 
            <div class="layui-inline">
                <input type="text" name="name" placeholder="请输入名称" autocomplete="off" class="layui-input">
            </div>
            <button class="layui-btn btn-primary" id="search">搜索</button>
             -->
            <div class="layui-inline right">
                <!-- <button class="layui-btn btn-primary" id="tags_add">添加</button> -->
                <button class="layui-btn btn-danger" id="tags_del">批量删除</button>
            </div>
        </div>
        <table id="list_table" class="layui-hide" lay-filter="mainList"></table>
    </div>
</div>

<script>
    layui.use(['layer', 'table'], function () {
        var layer = layui.layer;
        var table = layui.table;

        var tableObj = table.render({
            id: 'list_table',
            elem: '#list_table',
            url: '/registerUserType/listForPage',
            align: "center",
            cols: [[ //表头
                {type: 'checkbox'},
               /* {type: 'numbers', title: '序号',width:50},*/
                {field: 'id', title: '类型编号',width:100},
                {field: 'name', title: '类型名称', width: 150, align: 'center'},
                {field: 'count', title: '用户数量', width: 150, align: 'center'},
                {field: 'createTime', title: '创建时间', width: 180, align: 'center'},
                {
                    title: '操作', width: 150, align: 'center', unresize: true,templet: function (d) {
                        return '<a href="javascript:;" class="font-primary" lay-event="showUsers">查看用户</a>' ;
                    }
                }
            ]]
        });

        // 检索
        $("#search").click(function () {
            reloadTable(tableObj);
        });
     // 添加
        $("#tags_add").click(function () {
            showDialog({
                title: '添加'
                , template: 'add'
                , saveUrl: '/registerUserType/update'
                , tableObj: tableObj
            })
        });
       

        // 批量删除
        $("#tags_del").click(function () {
            var data = table.checkStatus('list_table').data;//已选中数据
            if (data.length == 0) {
                layer.msg("至少选择一条");
                return;
            }
            var arr = [];     //选中数组
            for (var i = 0; i < data.length; i++) {
                arr.push(data[i].id)
            }
            showConfirm("确认删除？", function () {
                $.ajax({
                    url: '/registerUserType/deleteBatchIds',
                    data: {"ids": arr.join(",")},
                    success: function (result) {
                        if (result.success) {
                            layer.msg("删除成功");
                            reloadTable(tableObj);
                        } else {
                            layer.msg("删除失败");
                        }
                    }
                })
            });
        });
        
        //表格内部操作按钮监听
        table.on('tool(mainList)', function (obj) { //注：tool是工具条事件名，mainList是table原始容器的属性 lay-filter="对应的值"
            var data = obj.data; //获得当前行数据
            var layEvent = obj.event; //获得 lay-event 对应的值
			//显示用户
            if (layEvent === 'showUsers') {            
                showDialog({
                    title: '用户信息', 
                    template: 'typeuser',
                    height: 600,
                    width:900,
                    htmlData: data,
                    btn: ['关闭'],
                    yes: function (index, layero) {
                        close(index);
                    }
                });
            }
           
        });

    });
</script>
